<template>
  <div class="add-car">
    <el-dialog
      custom-class="add-payment"
      v-el-drag-dialog="{ drag: true, full: false, resize: false }"
      :close-on-click-modal="false"
      :visible="true"
      @close="closeMd"
      width="600px"
      title="申请付款"
      append-to-body>
      <ApplyPaymentItem 
        v-for="(it,index) in list"
        ref="itemListRef"
        :key="index"
        :obj="it"
      />

      <div class="fm-btn-row">
        <el-button 
          :loading="fm.sb.load" 
          style="margin-left: 20px" 
          type="primary" 
          icon="el-icon-s-order" 
          @click="onSubmit">
          {{fm.sb.text}}
        </el-button>
      </div>

    </el-dialog>
  </div>
</template>

<script>
import elDragDialog from "@/directive/el-drag-dialog";

import * as orderSer from "@/api/services/order.service";
import ApplyPaymentItem from './apply-payment-item';

export default {
  name: "AddPayment",
  directives: {elDragDialog},
  props: {myData: Object},
  components: { ApplyPaymentItem },
  data() {
    return {
      // 列表
      list: this.myData.list || [],

      fm: {
        fname: "addPaymentFm",
        sb: { load: false, text: "立即申请" },
        ps: {

        },
      },
    };
  },
  created() {
  },
  methods: {
    closeMd() {
      this.$emit("myClick", {state: false});
    },
    // 提交表单
    async onSubmit() {
      const that = this, U = that.U, fm = that.fm;

      // 循环验证行表单
      let items = this.$refs.itemListRef;
      let itemArr = [];
      for (let i = 0; i < items.length; i++) {
        let res = await items[i].valRowFm();
        itemArr.push(res);
      }
      let valResult = itemArr.some(it => it === false);
      if (valResult){
        return;
      }else{
        // 保存没行的数据
        let itDataList = items.map(it => it.getFmData());
        let ps = {
          payInfo: itDataList.map(it => {
            return {
              orderId: it.orderId,
              payMoney: it.payMoney,
              gainTime: it.gainTime,
              remark: it.remark,
            }
          })
        }
        orderSer.setServicePay(ps).then(res => {
          if(res.code !== 1) {
            U.qerror(res.msg);
          }else{
            U.qsuccess(res.msg);

            that.closeMd();
            that.$emit("reloadDg");
          }
        });
      }
    }


  },
};
</script>